<template>
  <el-dialog title="批量修改"
             customClass="customWidth"
             :append-to-body="true" :close-on-click-modal="false" width="65%" top="8vh"
             :visible.sync="visible">
    <el-form :model="dataForm" :rules="dataRule" ref="dataForm" label-width="210px">
      <el-col :span="12">
        <el-form-item label="问题专题" prop="wtztYf">
          <el-dict code="XTZT_LIST" v-model="dataForm.wtztYf" placeholder="问题专题" clearable filterable
                   :disabled="disabled"></el-dict>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="严重程度" prop="yzcd" :rules="dataRule.yzcd">
          <el-select v-model="dataForm.yzcd"
                     :disabled="disabled"
                     class="width100"
                     filterable
                     placeholder="严重程度"
                     size="small">
            <el-option key="轻微" label="轻微" value="轻微"></el-option>
            <el-option key="一般" label="一般" value="一般"></el-option>
            <el-option key="严重" label="严重" value="严重"></el-option>
            <el-option key="阻断" label="阻断" value="阻断"></el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="解决方案" prop="yfjjfaYf"
                      :rules="(dataForm.dyztJf === '已解决待验证'||dataForm.dyztJf === '已完成') ? dataRule.yfjjfaYf : [{require: false}]">
          <el-dict code="RESOLUTION_LIST" v-model="dataForm.yfjjfaYf" placeholder="解决方案" clearable filterable
                   @change="yfjjfaYfChange"
                   :disabled="disabled"></el-dict>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="退回理由" prop="thlyYf"
                      :rules="dataForm.yfjjfaYf === 'frontline' ? dataRule.thlyYf : [{require: false}]">
          <el-dict code="THLY_LIST" v-model="dataForm.thlyYf" placeholder="退回理由" clearable filterable
                   :disabled="disabled"></el-dict>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="问题类型-乙方" prop="wtlxYf">
          <el-dict code="WTLXYF_LIST" v-model="dataForm.wtlxYf" :disabled="disabled" placeholder="问题类型-乙方" clearable
                   filterable></el-dict>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="总省标志" prop="zsbz">
          <el-dict code="ZJSJBZ_LIST" v-model="dataForm.zsbz" placeholder="用于监理验收统计，注意识别" :disabled="disabled"
                   filterable></el-dict>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="数据运维数量" prop="sjywsl">
          <el-input-number v-model="dataForm.sjywsl" :step="100" :disabled="sjywsldisabled"
                           ref="sjywslRef"
                           placeholder="数据运维数量"></el-input-number>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="问题标签" prop="markYf">
          <el-input v-model="dataForm.markYf" :disabled="disabled" :maxlength="100"
                    placeholder="问题标签"></el-input>
        </el-form-item>
      </el-col>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">关闭</el-button>
      <el-button v-if="!disabled" type="primary" @click="dataFormSubmit()">确定</el-button>
    </span>
  </el-dialog>
</template>

<script>

export default {
  data() {
    return {
      disabled: false,
      visible: false,
      sjywsldisabled: false,
      wtdhs: [],
      dataForm: {
        wtztYf: '',
        yzcd: '',
        yfjjfaYf: '',
        thlyYf: '',
        wtlxYf: '',
        zsbz: '',
        sjywsl: 0,
        markYf: ''
      },
      dataRule: {}
    }
  },
  components: {},
  methods: {
    init(wtdhs) {
      this.wtdhs = wtdhs || ''
      this.visible = true
      this.$nextTick(() => {
        // 重置表单数据
        this.$refs['dataForm'].resetFields()
      })
    },
    yfjjfaYfChange(val) {
      // 如果是不是打回一线处理，则不需要填写退回理由
      if (val !== 'frontline') {
        this.dataForm.thlyYf = ''
      }

      // 解决方案是要进行运维处理的，需要填入运维数量
      if (val === 'fixeddatao' || val === 'postponed') {
        this.$refs.sjywslRef.focus()
        this.sjywsldisabled = false
      } else {
        this.sjywsldisabled = true
        this.dataForm.sjywsl = '0'
      }
    },
    // 表单提交
    dataFormSubmit() {
      this.$refs['dataForm']
        .validate((valid) => {
          if (valid) {
            this.$confirm(`确定对进行[批量修改]操作?`, '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            }).then(() => {
              this.$http({
                url: `/zr/dytz/batchEdit`,
                method: 'post',
                data: this.dataForm,
                params: {
                  wtdhs: this.wtdhs.join(',')
                }
              }).then(({data}) => {
                if (data && data.code === 0) {
                  this.$message({
                    message: '操作成功,操作问题单号：' + this.wtdhs.join(','),
                    type: 'success',
                    duration: 3500
                  })
                  this.$emit('refreshDataList')
                }
              })
            }).catch(() => {
            })
          }
        })
    },
    /**
     * 带时分秒的当前时间
     * @returns {string}
     */
    getNowFormatDateSfm() {
      var date = new Date()
      const args = {
        y: date.getFullYear(),
        M: date.getMonth() + 1,
        d: date.getDate(),
        h: date.getHours(),
        m: date.getMinutes(),
        s: date.getSeconds()
      }
      for (const key in args) {
        const value = args[key]
        if (value < 10) args[key] = '0' + value
      }
      return args.y +
        '-' +
        args.M +
        '-' +
        args.d +
        ' ' +
        args.h +
        ':' +
        args.m +
        ':' +
        args.s
    }
  }
}
</script>
<style>
.customWidth {
  width: 75%;
}

.el-dialog__body {
  padding: 10px 20px;
}

.el-dialog__header {
  padding: 20px 20px 0px;
}

.el-button {
  margin: 0 5px;
}
</style>
